5 1* {3 HTML ja WWW - hypertekstin suuri mahdollisuus {3 --------------------------------------------- Antti Vähä-Sipilä {3Mitä on HTML? {3------------- Hyperteksti on nykyään pinnalla varsinkin Internetistä puhuttaessa. Mitä tämän termin taakse kätkeytyy? Hyperteksti on lyhyesti määriteltynä joukko dokumentte- ja, jossa käyttäjä voi siirtyä dokumentista toiseen sen mukaan, mikä sattuu kiinnostamaan. Hypertekstiin voidaan liittää kuvia, animaatioita, musiikkia ja puhetta, ja sen ympärille voidaan luoda täydellinen hyper/multimediaesitys käytettävissä olevan laitteiston ja tiedonsiirtoverkon kapasiteetin rajoissa. Pieni yksinkertainen esimerkki havainnollistanee asiaa. Luet juuri Amigan pro- sessorista kertovaa tekstiä, jossa esiintyy sana 68040. Teksti jatkuu kuvaillen PowerPC:tä, mutta olet enemmän kiinnostunut Motorolan luomuksista - siksi klik- kaat hiirelläsi "68040":aa, ja ruudulle ilmestyy lisätietoa tästä avainsanasta. Tästäkin dokumentista pääset taas eteenpäin ja niin edelleen. Teoriassa yhteen hypertekstiin voidaan mahduttaa kaikki maailman oleellinen tieto. Hyperteksti ei ole muodikkuudestaan huolimatta mikään uusi ilmiö. Mikäli luet tätä artikkelia AmigaGuidella, luet sitä hypertekstinä. AmigaGuide on hyvin tyy- pillinen perushyperteksti. Se mahdollistaa tekstilinkkien (linkki on hyppy doku- mentista toiseen) lisäksi ulkoisten ohjelmien ajamisen, jolloin voidaan esimer- kiksi katsoa kuvia tai kuunnella musiikkia. AmigaGuide näyttää tekstin tavalli- sessa ikkunassa, joten esimerkiksi Sakua lukiessa hypertekstistä saa hiukan ka- run vaikutelman. Hypertekstin suosio kasvaa koko ajan, ja yhä useammissa PD- ja Shareware-ohjelmissa on dokumentointi ainoastaan AmigaGuiden .guide-loppuisena tiedostona. AmigaGuidessa on kuitenkin tiettyjä rajoituksia. Dokumenttien on käytännössä ol- tava samalla koneella, mikä rajoittaa tiedon määrää. AmigaGuide-yhteensopivia lukuohjelmiakaan ei ole olemassa kuin Amigalle ja PC:lle. Ratkaisu tähän on standardeihin pohjautuva HTML-kieli. HTML tulee sanoista HyperText Markup Language. Sillä kuvataan näytettävä doku- mentti erittäin samankaltaisella tyylillä kuin AmigaGuide, yleensä kylläkin jo- kainen linkki jaetaan omaksi .html-loppuiseksi tiedostokseen. Myös tiedoston sisälle pystyy muodostamaan linkkejä kuten AmigaGuidessakin. HTML-dokumenttien lukemiseen on kehitetty useita lukuohjelmia, joista tunnetuimmat ovat tekstipoh- jaisille käyttöliittymille Lynx ja graafisille Mosaic. Kun esimerkiksi Mosaic käynnistetään, se hakee ja näyttää aloitusdokumentin. Siitä eteenpäin Mosaic toimii AmigaGuiden kaltaisesti kuitenkin sillä erolla, että linkki, joka dokumentissa on, voi osoittaa vaikka toisella puolella maail- maa olevaan dokumenttiin. Nämä yhteenliitetyt linkit muodostavat Internetissä maailmanlaajuisen World Wide Web - eli WWW- eli W3-verkon. Tavallinen käyttäjä ei huomaa maailmanlaajuisuutta kuin pitkistä hakuajoista (mikäli dokumentti hae- taan jostain hyvin kaukaa ruuhka-aikana) ja satunnaisista yhteydenottovaikeuk- sista (Internet on tunnettu siitä, ettei mikään yhteys ole sataprosenttisen var- masti pystyssä). Internetissä on arviolta 30 miljoonaa käyttäjää ja miljoonia tietokoneita. Kas- vuvauhti on arvioitu (juuri WWW:n suosion ansiosta) 20 prosentiksi kuukaudessa. Miten omassa Amigassasi pyörivä pikku AMosaic voi löytää juuri sen oikean tie- doston näiden miljoonien koneiden kovalevyjen hakemistojen sokkeloista? Ratkaisu on URL, Uniform Resource Locator eli "yhtenäinen resurssienpaikallistin". Se on rivi tekstiä, joka koostuu protokollasta, koneen nimestä, sen sijainnista ja tiedoston sijainnista tällä koneella. Esimerkiksi Sakun kotisivu WWW:ssä sijaitsee osoitteessa http://proffa.cc.tut.fi/~v150105/saku.html Kun AMosaic saa tämän rivin, se ensinnäkin tietää, millainen yhteys sen täytyy ottaa, jotta dokumentti irtoaisi. HTTP on HyperText Transfer Protocol eli proto- kolla HTML-tiedostoja varten. Seuraavaksi ohjelma näkee, minne HTTP-pyyntö on lähetettävä; kone on Suomessa (fi) sijaitseva Tampereen teknillisen korkeakoulun (tut) laskentakeskuksen (cc) opiskelijakone "proffa". Sen kovalevyiltä löytyy käyttäjän v150105 kotihakemisto, jossa on dokumentti saku.html. (Itse asiassa tässä tapauksessa dokumentti saku.html ei sijaitse tässä hakemistossa, vaan ai- van muualla - mutta siitä taas ei URL:n käyttäjän kannata välittää; kyseessä on symbolinen linkki.) Myös muunlaisia URL:eja on mahdollisuus tehdä. Protokollista käytössä ovat mm. FTP, jolloin lukuohjelma toimii ftp-ohjelman tavoin. Sakun lähes kaikki aikai- semmat numerot löytyvätkin URL:sta ftp://ftp.funet.fi/pub/amiga/misc/diskmags/Finnish/ Vanhempi tiedonetsintäohjelma Gopher on myös tuettujen protokollien joukossa, ja lisäksi lukuohjelmilla voi sopivilla URL:eilla lähettää mailia ja lukea newssejä. Kun WWW:ssä liikkuu ja seuraa kiinnostavalta tuntuvia linkkejä, voi äkkiä löytää itsensä esimerkiksi Etelä-Afrikasta. Eksyminen on helppoa, mutta onneksi ohjel- missa on muutama edellinen linkki tallessa, jotta taaksepäin voi palata. Vaikeu- tena on suuren suuresta valikoimasta löytää haluamansa tieto. Siihen auttaa FAQ-tiedostojen lukeminen, WWW-uutisryhmien aktiivinen seuraaminen ja hakemisto- sivujen käyttö. Parhaimmilla hakemistosivuilla on satoja linkkejä tärkeimpiin paikkoihin. WWW:stä löytyvät esimerkiksi tämänhetkiset sääsatelliittikuvat ympäri maapallon. WWW ja Internet ovat niin laajoja käsitteitä, etten niihin tämän enempää paneudu. Aloittelija voi lainata kirjastosta Kari Hintikan kirjan "Internet: Kalastusta tietoverkoilla", jonka pitäisi olla varsin hyvä esittely asiasta. Palataan vielä AmigaGuideen. Esimerkiksi Saku julkaistaan aina diskettilehden lisäksi AmigaGuidena ja nykyään myös HTML-dokumenttina, jotka saa luettavakseen URL:sta http://proffa.cc.tut.fi/~v150105/saku.html. Koska AmigaGuide ja HTML ovat niin lähellä toisiaan, syötämme vain valmiin .guide -tekstin kuvineen päivineen ohjelmalle, joka sylkäisee toisesta päästä kasan .html-tiedostoja. Ku- vat käännetään GIF:eiksi, koska GIF on (de facto?) standardi tekstin seassa näytettäville kuville (nk. inline images). AmigaGuidesta HTML:ään kääntäviä ohjelmia on ainakin kaksi, jotka löytyvät Ami- netistä. Toinen on perl-skripti, ag2html, jota on käytetty Sakun käännöksessä. Toinen on C-kielinen ohjelma guide2html. Ne ovat periaatteessa aivan toisiaan vastaavia. Päinvastaiseen suuntaan kääntävän ohjelman tekeminen ei ole sen vai- keampaa, mutta niitä ei ole näkynyt, ja niille onkin vähemmän käyttöä. Ohjelmat saa ainakin Aminetin FTP-siteilta. Ag2html-skriptin saat itsellesi esimerkiksi Sakun kotisivuilta löytyvästä lin- kistä. Jokaisen käännetyn AG-sivun loppuun ilmestyy tämän käännösohjelman "mai- nos". Seuraavassa osuudessa käyn lähemmin läpi, miten saat nopeasti tehtyä itsellesi oman sivun WWW:hen, jos sinulla on Internetiin kiinteästi liitetty kone tai tun- nus esimerkiksi korkeakoulun tai kaupallisen laitoksen koneella. {3 Kuinka luon oman WWW-kotisivun? {3 ------------------------------- {31. Perusteet {3------------ Haluat siis tehdä verkkoon oman WWW-kotisivun. Jos koneellasi on muillakin sel- laisia, niin asian pitäisi onnistua. Muutoin ota yhteyttä koneesi ylläpitoon ja kysy, onko se mahdollista. Dokumentit löytyvät kotihakemistossasi olevasta public_html-nimisestä hakemis- tosta, joten luo sellainen. Oletusarvoinen aloitusdokumentti on tekstitiedosto nimeltä index.html, eli tee editorillasi kyseinen dokumentti, jossa lukee Olet juuri tehnyt itsellesi tyhjän kotisivun WWW:hen. Kotisivusi URL on http://koneesi.nimi.tähän/~käyttäjätunnus/ jossa "koneesi.nimi.tähän" muuttuu esimerkiksi "mits.mdata.fi":ksi ja ~käyttäjätunnus on kotihakemistosi (~ tar- koittaa kotihakemistoa), esimerkiksi ~avs. Jos koneessasi näin on päätetty, sivusi ilmestynee viimeistään seuraavana yönä viralliseen kotisivulistaan. Yleensä URL on tällöin muotoa http://www.konee- si.nimi/~käyttistunnus/. Tämä vaihtelee systeemin ylläpidosta riippuen. Kysäisepä sysadminiltasi. {32. Tietoa tarjolle {3------------------ Päätä ensin sivusi nimi. Lisää - ja -merkintöjen väliin teksti Sivuni nimi. Olet juuri saanut valmiiksi sivun otsikkokentän. HTML-kieli jakaa tekstin kenttiin, jotka alkavat - tunnuksella ja päättyvät -tunnukseen. Ensimmäinen kenttä on , joka ilmaisee HTML-kielisen dokumentin alkamisen. ilmaisee otsikkokentän alun, sivun nimen. lopettavat otsikkokentän ja aloittaa varsi- naisen sivun rungon. Sivu tulee tähän väliin ja ihan viimeiseksi jätetään . Varsinainen tarjoamasi tieto tulee siis - ja -lausekkeiden väliin. Tekstin voi kirjoittaa ilman, että huolehtii paljon sen ulkoasusta; WWW-lukija taittaa tekstin sivulle järkevän näköisesti. Nyt voit jo kirjoittaa jotain jut- tua sivulle. Seuraavaksi katsomme, miten saat sivusi pelkästä tekstistä hyper- tekstiksi. {33. Linkkejä maailmalle {3---------------------- Linkit muodostetaan komennolla eli anchor. Koko linkin syntaksi on Linkki, jolloin sanaa "Linkki" klikkaamalla käyttäjä siirtyy do- kumenttiin, johon osoittaa URL. URL voi olla myös suhteellinen, eli pelkkä siirtää käyttäjän samassa hakemistossa olevaan osoitteet.html-nimiseen dokumenttiin. Esimerkkejä URLeista, kokeile: http://proffa.cc.tut.fi/~v150105/saku.html (HTTP-yhteys Sakun sivuille) ftp://ftp.cdrom.com/pub/aminet/ (FTP-yhteys Aminettiin) gopher://oulu.fi/ (Oulun Gopher-yhteys) gopher://mits.mdata.fi:79//avs (Finger-komento) mailto:v150105@cc.tut.fi (Lähettää mailia) news:sfnet.atk.amiga (Lukee uutisryhmää) Lisää URL-esimerkkejä löytyy kaikista WWW:tä käsittelevistä uutisryhmistä. {34. Hienosäätöä {3-------------- HTML-kieli on varsin monipuolinen, ja tuleva HTML+ on vielä laajempi. Näin pi- kaisessa aloittelijan oppaassa on turha käydä kaikkia aspekteja läpi; verkosta löytyy paljon hyviä oppaita (kotisivultani pääsee ainakin erittäin hyvään oppaa- seen). Käsitellään lyhyesti pari oleellista asiaa tulostuksen muotoilun osalta: 
 ja
aiheuttavat sen, että näiden välissä oleva teksti näytetään non-proportional-fontilla, eli jokainen kirjain vie saman verran tilaa ja että tekstin muotoilu on juuri se mitä haluat (pre=preformatted).
katkaisee rivin juuri siitä (br=break). :llä, esimerkiksi:

ja

rajaavat tekstikappaleen (p=paragraph). Itse asiassa näitä ei _tar- vitsisi_ käyttää pareina, mutta HTML-kielen määritelmän mukaan näin täytyy tehdä. Siksi suosittelen, että _jokainen_ komento annetaan aina täydellisenä, eli dokumentissa on sekä komennon aloitus- että lopetusmerkit. Jos näet jollakin sivulla hienon trikin, voit oppia, miten se tehdään, kun käytät WWW-lukijasi View Source -toimintoa, Lynxillä ainakin joissain versioissa \-merkki.